import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router'
import HomeView from '../views/HomeView.vue'

const routes: Array<RouteRecordRaw> = [
    {
        path: '/',
        name: 'home',
        component: HomeView,
        redirect: 'goods',
        children: [
            {
                path: 'goods',
                name: 'GoodsView',
                meta: {
                    isShow: true, // 自定义：是否需要展示此路由
                    title: '商品列表',
                    keepAlive: true
                },
                component: () => import(/* webpackChunkName: "goods" */ '../views/GoodsView.vue')
            },
            {
                path: 'user',
                name: 'UserView',
                meta: {
                    isShow: true, // 自定义：是否需要展示此路由
                    title: '用户列表',
                    keepAlive: false
                },
                component: () => import(/* webpackChunkName: "user" */ '../views/UserView.vue')
            },
            {
                path: 'role',
                name: 'RoleView',
                meta: {
                    isShow: true, // 自定义：是否需要展示此路由
                    title: '角色列表',
                    keepAlive: false
                },
                component: () => import(/* webpackChunkName: "role" */ '../views/RoleView.vue')
            },
            {
                path: 'authority',
                name: 'AuthorityView',
                meta: {
                    isShow: false, // 自定义：是否需要展示此路由
                    title: '权限列表',
                    keepAlive: false
                },
                component: () => import(/* webpackChunkName: "authority" */ '../views/AuthorityView.vue')
            },
            // {
            //     path: '/vant',
            //     name: 'vant',
            //     meta: {
            //         isShow: true, // 自定义：是否需要展示此路由
            //         title: 'vant组件的使用'
            //     },
            //     component: () => import(/* webpackChunkName: "vant" */ '../views/VantView.vue')
            // }

        ]
    },
    {
        path: '/about',
        name: 'about',
        // route level code-splitting
        // this generates a separate chunk (about.[hash].js) for this route
        // which is lazy-loaded when the route is visited.
        component: () => import(/* webpackChunkName: "about" */ '../views/AboutView.vue')
    },
    {
        path: '/login',
        name: 'login',
        component: () => import(/* webpackChunkName: "login" */ '../views/LoginView.vue')
    },
    // {
    //     path: '/vant',
    //     name: 'vant',
    //     meta: {
    //         isShow: true, // 自定义：是否需要展示此路由
    //         title: 'vant组件的使用'
    //     },
    //     component: () => import(/* webpackChunkName: "vant" */ '../views/VantView.vue')
    // }

]

const router = createRouter({
    history: createWebHistory(process.env.BASE_URL),
    routes
})

// 全局路由守卫
router.beforeEach((to, from, next) => {
    const token: string | null = localStorage.getItem('token')
    if (!token && to.path !== '/login') {
        next('/login')
    } else {
        next()
    }
})

export default router
